<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>欢迎使用<?php echo SYS_NAME;?>内容管理系统</title>
	    <link rel="stylesheet" type="text/css" href="<?php echo SITE_HOST ? 'public/' : ''?>assets/common/css/iview.css">
	    <link rel="stylesheet" href="<?php echo SITE_HOST ? 'public/' : ''?>assets/common/css/bootstrap.min.css">

        <style type="text/css">
            body {
                background-color: #eff3f6;
            }

            .ivu-icon.ivu-icon-close-circled {
                color: #E53939;
            }

            .box.box-default .box-body {
                padding: 10px;
                background-color: #FFFFFF;
                border-radius: 5px;
            }
        </style>
    </head>
    <body>
        <div id="install" style="width: 600px;margin: 0 auto;padding-top: 20px;">
            <h2 style="text-align: center;line-height: 70px;">欢迎使用<?php echo SYS_NAME;?>内容管理系统</h2>

            <i-form ref="form" :rules="rules" :model="form" :label-width="100">
                <div class="box box-default">
                    <div class="box-body">
                        <h3 style="text-align: center;line-height: 50px;">环境检测</h3>
                        <div class="row">
                            <div class="col-md-6">
                                <Form-item label="当前PHP版本"><span>{$data['phpversion']}</span>（建议7.0）</Form-item>
                            </div>
                            <div class="col-md-6">
                                <Form-item label="当前环境系统"><span>{$data['os']}</span></Form-item>
                            </div>
                            <div class="col-md-6">
                                <Form-item label="pdo"><span>{$data['pdo']}</span></Form-item>
                            </div>
                            <div class="col-md-6">
                                <Form-item label="pdo_mysql"><span>{$data['pdo_mysql']}</span></Form-item>
                            </div>
                            <div class="col-md-6">
                                <Form-item label="curl"><span>{$data['curl']}</span></Form-item>
                            </div>
                            <div class="col-md-6">
                                <Form-item label="allow_url_fopen"><span>{$data['allow_url_fopen']}</span></Form-item>
                            </div>
                            <div class="col-md-6">
                                <Form-item label="file_get_contents"><span>{$data['file_get_contents']}</span></Form-item>
                            </div>
                            <div class="col-md-6">
                                <Form-item label="runtime"><span>{$data['checklist']['cache']['w'] ? '<Icon type="checkmark-circled"></Icon> 可写 ' : '<Icon type="close-circled"></Icon></i> 不可写'}</span></Form-item>
                            </div>
                            <div class="col-md-6">
                                <Form-item label="public/install"><span>{$data['checklist']['install']['w'] ? '<Icon type="checkmark-circled"></Icon> 可写 ' : '<Icon type="close-circled"></Icon></i> 不可写'}</span></Form-item>
                            </div>
                            <div class="col-md-6">
                                <Form-item label="app"><span>{$data['checklist']['config']['w'] ? '<Icon type="checkmark-circled"></Icon> 可写' : '<Icon type="close-circled"></Icon> 不可写'}</span></Form-item>
                            </div>
                        </div>
                    </div>
                </div>

                <div style="background: #fff;padding: 10px;border-radius: 5px;margin-top: 15px;">
                    <h3 style="text-align: center;line-height: 50px;">数据库信息填写</h3>
                    <p style="text-align: center;color: #FF0000;font-size: 20px;">注意：系统不会创建数据库，用户需要提前准备好数据库</p>
                    <Form-item label="目录运行URL">
                        <i-input v-model="form.installAddress" placeholder="用于二级目录安装，非目录安装站点，请勿填写"></i-input>
                        <p>例如：http://www.test.com/news/</p>
                        <p>末尾请加反斜杠，非目录安装站点，请勿填写</p>
                    </Form-item>
                    <Form-item label="数据库地址" prop="dbHost">
                        <i-input v-model="form.dbHost"></i-input>
                    </Form-item>
                    <Form-item label="数据库端口" prop="dbHostport">
                        <i-input v-model="form.dbHostport"></i-input>
                    </Form-item>
                    <Form-item label="数据库 名称" prop="database">
                        <i-input v-model="form.database" placeholder="链接数据库的名称"></i-input>
                    </Form-item>
                    <Form-item label="数据库 用户" prop="dbUsername">
                        <i-input v-model="form.dbUsername" placeholder="链接数据库的用户名"></i-input>
                    </Form-item>
                    <Form-item label="数据库 密码">
                        <i-input type="password" v-model="form.dbPassword" placeholder="链接数据库的密码"></i-input>
                    </Form-item>
                    <hr />
                    <h3 style="text-align: center;line-height: 50px;">管理员信息填写</h3>
                    <Form-item label="管理账户" prop="username">
                        <i-input v-model="form.username"></i-input>
                    </Form-item>
                    <Form-item label="管理密码" prop="password">
                        <i-input type='password' v-model="form.password"></i-input>
                    </Form-item>
                    <Form-item label="重复密码" prop="rpassword">
                        <i-input type='password' v-model="form.rpassword"></i-input>
                    </Form-item>
                    
                    <Form-item label="演示数据">
                        <radio-group v-model="testData">
                            <radio label="">不安装</radio>
                            <radio label="1">安装</radio>
                        </radio-group>
                    </Form-item>
                </div>
                <div style="text-align: center;padding:40px;">
                    <I-button type="primary" @click="submitForm('form')">立即安装</I-button>
                </div>
            </i-form>

        </div>
    </body>
	<script src="<?php echo SITE_HOST ? 'public/' : ''?>assets/common/js/components.js"></script>
	<script src="<?php echo SITE_HOST ? 'public/' : ''?>assets/common/js/iview.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        new Vue({
            el: "#install",
            data: function() {
                return {
                    testData: '',
                    form: {
                        domain: '{$Think.server.HTTP_HOST}',
                        installAddress: '',
                        dbHost: "127.0.0.1",
                        dbHostport: "3306",
                        database: "",
                        dbUsername: "",
                        dbPassword: "",
                        dbPrefix: "",
                    },
                    rules: {
                        dbHost: [{
                            required: true,
                            message: "必填项",
                            trigger: "blur"
                        }, ],
                        dbHostport: [{
                            required: true,
                            message: "必填项",
                            trigger: "blur"
                        }, ],
                        database: [{
                            required: true,
                            message: "必填项",
                            trigger: "blur"
                        }, ],
                        dbUsername: [{
                            required: true,
                            message: "必填项",
                            trigger: "blur"
                        }, ],
                        dbPassword: [{
                            required: true,
                            message: "必填项",
                            trigger: "blur"
                        }, ],
                        username: [{
                            required: true,
                            message: "必填项",
                            trigger: "blur"
                        }, ],
                        password: [{
                                required: true,
                                message: "必填项",
                                trigger: "blur"
                            },
                            {
                                min: 5,
                                max: 25,
                                message: '长度在 5 到25 个字符',
                                trigger: 'blur'
                            }
                        ],
                        rpassword: [{
                                required: true,
                                message: "必填项",
                                trigger: "blur"
                            },
                            {
                                min: 5,
                                max: 25,
                                message: '长度在 5 到25 个字符',
                                trigger: 'blur'
                            }
                        ],
                    }
                }
            },
            methods: {
                submitForm: function(formName) {
                    this.$refs[formName].validate((valid) => {
                        if (valid) {
                            var installDomain = '';
                            if (this.form.installAddress) {
                                installDomain = this.form.installAddress;
                            }
                            axios.post(installDomain + '/index.php?s=/install/installPost', {
                                "installAddress": this.form.installAddress,
                                "domain": this.form.domain,
                                "dbHost": this.form.dbHost,
                                "dbHostport": this.form.dbHostport,
                                "database": this.form.database,
                                "dbUsername": this.form.dbUsername,
                                "dbPassword": this.form.dbPassword,
                                "dbPrefix": this.form.dbPrefix,
                                "username": this.form.username,
                                "password": md5(this.form.password),
                                "rpassword": md5(this.form.rpassword),
                                testData: this.testData,
                            }).then(res => {
                                if (res.data.code == 1) {
                                    location.href = installDomain +
                                        '/index.php?s=/admin/';
                                } else {
                                    this.$Message.error({
                                        content: res.data.msg,
                                        duration: 3
                                    });
                                }
                            }, err => {
                                if (installDomain) {
                                    this.$Message.error({
                                        content: '目录运行URL填写错误，如果非目录安装，请勿填写',
                                        duration: 3
                                    });
                                }
                            });

                        } else {
                            return false;
                        }
                    });
                },
            }
        });
    </script>
    <script>
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?3155433929be1afd6cef849b9709d4d7";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>
</html>
